<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/commons/global.jsp"%>

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title>极乐佛经后台管理系统</title>
<link href="${baseUrl}/resources/bootstrap-3.3.5/css/bootstrap.min.css"
	rel="stylesheet">

<!-- <link -->
<%-- 	href="${baseUrl}/resources/font/Font-Awesome-3.2.1/css/font-awesome.min.css" --%>
<!-- 	rel="stylesheet" /> -->


<link
	href="${baseUrl}/resources/Font-Awesome-4.6.3/css/font-awesome.min.css"
	rel="stylesheet" />

<link rel="stylesheet" type="text/css"
	href="${baseUrl}/resources/jquery-easyui-1.4.5/themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css"
	href="${baseUrl}/resources/jquery-easyui-1.4.5/themes/icon.css">
<link rel="stylesheet" type="text/css"
	href="${baseUrl}/resources/css/app.css">

<script type="text/javascript"
	src="${baseUrl}/resources/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript"
	src="${baseUrl}/resources/jquery-easyui-1.4.5/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="${baseUrl}/resources/jquery-easyui-1.4.5/locale/easyui-lang-zh_CN.js"></script>
</head>

<style>
/* 修改jquery-easy-ui样式 */
/* 手风琴标题样式 */
.accordion .accordion-header {
	background-color: rgba(196, 196, 196, 0.1);
}

/* 网格列选中样式 */
.datagrid-row-selected {
	background: rgba(154, 192, 205, 0.5);
	color: rgba(0, 0, 0, 0.7);
	font-weight: 600;
}

/* 树节点选中样式 */
.tree-node-selected {
	background: rgba(242, 242, 242, 1);
	color: rgba(0, 0, 0, 0.5);
	font-weight: 600;
}

/* 手风琴选中样式 */
.accordion .accordion-header-selected {
	background: rgba(196, 196, 196, 0.5);
	color: #8F8F8F;
	font-weight: 600;
}
/* 手风琴选中标题样式 */
.accordion .accordion-header-selected .panel-title {
	color: #8F8F8F;
	font-weight: 600;
}

/* 下拉选框选中项样式 */
.combobox-item-selected {
	background: rgba(154, 192, 205, 1);
	color: rgba(0, 0, 0, 0.7);
	font-weight: 600;
}

/* 布局西部标题样式 */
.layout-panel-west>.panel-header {
	background: linear-gradient(to bottom, #DEDEDE 0, #F2F2F2 100%);
}
</style>

<body class="easyui-layout">
	<div data-options="region:'north',border:false"
		style="height: 60px; padding: 5px">
		<div class="top-content-wrapper">
			<div class="manager-wrapper">
				<div class="system-wrapper" style="float: left;">
					<div class="logo"
						style="font-size: 20px; width: 249px; height: 50px; text-align: center; line-height: 50px; letter-spacing: 10px;">
						<a href=""><span><i class="icon-home"></i>极乐佛经管理平台</span></a>
					</div>
				</div>
				<div class="system-user-split"
					style="float: left; width: 1px; height: 30px; margin-top: 10px; background-color: black;"></div>
				<div class="manager-info" style="float: left; margin-left: 10px;">
					<div class="user-img-div"
						style="float: left; width: 50px; height: 50px; border-radius: 50px;">
						<img class="user-img"
							style="width: 50px; height: 50px; border-radius: 50px;"
							src="${baseUrl}/resources/img/siwangbiji2.jpg" />
					</div>
					<div class="user-name"
						style="text-align: left; float: left; width: 100px; height: 50px; margin-left: 5px;">
						<div class="role"
							style="height: 25px; line-height: 25px; font-size: 13px; font-weight: 600; font-style: italic;">管理员</div>
						<div class="nickname"
							style="height: 25px; line-height: 25px; font-size: 13px;">三千</div>
					</div>
					<div class="clear-both"></div>
				</div>
				<div class="system-bar-wrapper"
					style="float: right; margin-right: 100px;">
					<div class="btn-group" role="group" aria-label="..."
						style="margin: 10px auto;">
						<a type="button" class="btn btn-default clear-radius"
							style="border: 0;"><i class="icon-signout"></i> 退出</a> <a
							type="button" class="btn btn-default clear-radius"
							style="border: 0;"> ...</a>
					</div>
				</div>
				<div class="clear-both"></div>
			</div>

		</div>

	</div>

	<div data-options="region:'west',split:true,title:'控制台'"
		style="width: 249px;">

		<div id="mainAccordion"></div>

	</div>

	<!--<div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>-->
	<div data-options="region:'south',border:false"
		style="height: 50px; text-align: center; line-height: 50px;">
		Copyright&copy;2016 XX极乐佛经精油公司 All Rights Reserved. 沪ICP备XXXXXX-XXX</div>
	<div data-options="region:'center',title:''">
		<div class="easyui-tabs" id="main-tabs"
			style="width: 100%; height: 100%;">
			<div title="首页" data-options="closable:false,node_id:'main'"
				style="padding: 10px;"></div>
		</div>
	</div>

</body>
<script type="text/javascript">
	function setHistory(id, title, url) {
		window.history.pushState({
			id : id
		}, title, url);
	}

	function setCurTab(node) {
		if (node.attributes.url) {
			setHistory(node.id, '极乐佛经后台管理系统', baseUrl + '?_node=' + node.id)
		} else {
			return;
		}

		if ($('#main-tabs').tabs('exists', node.text)) {
			$('#main-tabs').tabs('select', node.text);
		} else {
			$('#main-tabs').tabs('add', {
				title : node.text,
				href : node.attributes.url,
				closable : true,
				style : 'padding: 10px',
				node_id : node.id
			});
		}
	}

	var bannerAccordion_tree_main = undefined;
	var videoAccordion_tree_main = undefined;
	var categoryAccordion_tree_main = undefined;
	var tagAccordion_tree_main = undefined;
	var mainAccordion = undefined;
	$(function() {
		mainAccordion = $('#mainAccordion');

		var bannerAccordion_main = $('<div id="bannerAccordion_main" title="广告栏管理" class="acc_mod" data-options="iconCls:\'fa fa-cogs\'"></div>');
		mainAccordion.append(bannerAccordion_main);

		var bannerAccordion_panel_main = $('<div id="bannerAccordion_panel_main" style="padding: 10px"></div>');
		bannerAccordion_main.append(bannerAccordion_panel_main);

		bannerAccordion_panel_main.panel({});

		bannerAccordion_tree_main = $('<ul id="bannerAccordion_tree_main" class="acc_tree-mod"></ul>');
		bannerAccordion_panel_main.append(bannerAccordion_tree_main);

		bannerAccordion_tree_main.tree({
			lines : true,
			animate : true,
			data : [ {
				"id" : 'bannerConfig',
				"text" : "广告栏管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'bannerQuery',
					"text" : "广告栏查询",
					attributes : {
						url : baseUrl + "/banner/list.html"
					}
				} ]
			} ],
			onDblClick : function(node) {
				setCurTab(node);
			}
		});

		var categoryAccordion_main = $('<div id="categoryAccordion_main" title="分类管理" class="acc_mod" data-options="iconCls:\'fa fa-cogs\'"></div>');
		mainAccordion.append(categoryAccordion_main);

		var categoryAccordion_panel_main = $('<div id="categoryAccordion_panel_main" style="padding: 10px"></div>');
		categoryAccordion_main.append(categoryAccordion_panel_main);

		categoryAccordion_panel_main.panel({});

		categoryAccordion_tree_main = $('<ul id="categoryAccordion_tree_main" class="acc_tree-mod"></ul>');
		categoryAccordion_panel_main.append(categoryAccordion_tree_main);

		categoryAccordion_tree_main.tree({
			lines : true,
			animate : true,
			data : [ {
				"id" : 'categoryConfig',
				"text" : "分类管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'categoryQuery',
					"text" : "分类查询",
					attributes : {
						url : baseUrl + "/category/list.html?entity=true"
					}
				}, {
					"id" : 'notEntityCategoryQuery',
					"text" : "分类集查询",
					attributes : {
						url : baseUrl + "/category/list.html?entity=false"
					}
				} ]
			} ],
			onDblClick : function(node) {
				setCurTab(node);
			}
		});

		var tagAccordion_main = $('<div id="tagAccordion_main" title="标签管理" class="acc_mod" data-options="iconCls:\'fa fa-cogs\'"></div>');
		mainAccordion.append(tagAccordion_main);

		var tagAccordion_panel_main = $('<div id="tagAccordion_panel_main" style="padding: 10px"></div>');
		tagAccordion_main.append(tagAccordion_panel_main);

		tagAccordion_panel_main.panel({});

		tagAccordion_tree_main = $('<ul id="tagAccordion_tree_main" class="acc_tree-mod"></ul>');
		tagAccordion_panel_main.append(tagAccordion_tree_main);

		tagAccordion_tree_main.tree({
			lines : true,
			animate : true,
			data : [ {
				"id" : 'tagConfig',
				"text" : "标签管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'tagQuery',
					"text" : "标签查询",
					attributes : {
						url : baseUrl + "/tag/list.html"
					}
				} ]
			} ],
			onDblClick : function(node) {
				setCurTab(node);
			}
		});

		var videoAccordion_main = $('<div id="videoAccordion_main" title="视频管理" class="acc_mod" data-options="iconCls:\'fa fa-cogs\'"></div>');
		mainAccordion.append(videoAccordion_main);

		var videoAccordion_panel_main = $('<div id="videoAccordion_panel_main" style="padding: 10px"></div>');
		videoAccordion_main.append(videoAccordion_panel_main);

		videoAccordion_panel_main.panel({});

		videoAccordion_tree_main = $('<ul id="videoAccordion_tree_main" class="acc_tree-mod"></ul>');
		videoAccordion_panel_main.append(videoAccordion_tree_main);

		videoAccordion_tree_main.tree({
			lines : true,
			animate : true,
			data : [ {
				"id" : 'videoConfig',
				"text" : "视频源管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'videoQuery',
					"text" : "视频查询",
					attributes : {
						url : baseUrl + "/video/list.html?isEntity=true"
					}
				}, {
					"id" : 'notEntityVideoQuery',
					"text" : "视频集查询",
					attributes : {
						url : baseUrl + "/video/list.html?isEntity=false"
					}
				} ]
			}, {
				"id" : 'recommendVideoConfig',
				"text" : "推荐视频管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'recommendVideoQuery',
					text : '推荐视频查询',
					attributes : {
						url : baseUrl + "/recommend/list.html?itemType=1"
					}
				} ]
			}, {
				"id" : 'categoryVideoConfig',
				"text" : "分类视频管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'categoryVideoQuery',
					text : '分类视频查询',
					attributes : {
						url : baseUrl + "/category/item/list.html?itemType=1"
					}
				} ]
			}, {
				"id" : 'tagVideoConfig',
				"text" : "标签视频管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'tagVideoQuery',
					text : '标签视频查询',
					attributes : {
						url : baseUrl + "/tag/item/list.html?itemType=1"
					}
				} ]
			} ],
			onDblClick : function(node) {
				setCurTab(node);
			}
		});

		var audioAccordion_main = $('<div id="audioAccordion_main" title="音频管理" class="acc_mod" data-options="iconCls:\'fa fa-cogs\'"></div>');
		mainAccordion.append(audioAccordion_main);

		var audioAccordion_panel_main = $('<div id="audioAccordion_panel_main" style="padding: 10px"></div>');
		audioAccordion_main.append(audioAccordion_panel_main);

		audioAccordion_panel_main.panel({});

		audioAccordion_tree_main = $('<ul id="audioAccordion_tree_main" class="acc_tree-mod"></ul>');
		audioAccordion_panel_main.append(audioAccordion_tree_main);

		audioAccordion_tree_main.tree({
			lines : true,
			animate : true,
			data : [ {
				"id" : 'audioConfig',
				"text" : "音频源管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'audioQuery',
					"text" : "音频查询",
					attributes : {
						url : baseUrl + "/audio/list.html?isEntity=true"
					}
				}, {
					"id" : 'notEntityaudioQuery',
					"text" : "音频集查询",
					attributes : {
						url : baseUrl + "/audio/list.html?isEntity=false"
					}
				} ]
			}, {
				"id" : 'recommendaudioConfig',
				"text" : "推荐音频管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'recommendaudioQuery',
					text : '推荐音频查询',
					attributes : {
						url : baseUrl + "/recommend/list.html?itemType=2"
					}
				} ]
			}, {
				"id" : 'categoryaudioConfig',
				"text" : "分类音频管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'categoryaudioQuery',
					text : '分类音频查询',
					attributes : {
						url : baseUrl + "/category/item/list.html?itemType=2"
					}
				} ]
			}, {
				"id" : 'tagaudioConfig',
				"text" : "标签音频管理",
				"state" : "closed",
				"children" : [ {
					"id" : 'tagaudioQuery',
					text : '标签音频查询',
					attributes : {
						url : baseUrl + "/tag/item/list.html?itemType=2"
					}
				} ]
			} ],
			onDblClick : function(node) {
				setCurTab(node);
			}
		});

		mainAccordion.accordion({
			width : 249,
			animate : true,
			multiple : true,
			selected : false
		});

		var main_tabs = $('#main-tabs').tabs(
				{
					onSelect : function(title, index) {

						var curOpts = main_tabs.tabs('getTab', index).panel(
								'options');
						setHistory(curOpts.node_id, '极乐佛经后台管理系统', baseUrl
								+ "?_node=" + curOpts.node_id);
					}
				});

		if ('${param._node}') {

			var _curTree = undefined;
			var _curNode = undefined;
			$('.acc_tree-mod').each(function(_inx, _val) {
				var cn = $(_val).tree('find', '${param._node}');
				if (cn) {
					_curTree = $(_val);
					_curNode = cn;
				}
			});

			if (_curNode) {

				mainAccordion.accordion('select', mainAccordion.accordion(
						'getPanelIndex', $('#' + _curNode.domId).closest(
								'.acc_mod')));

				_curTree.tree('expand', _curTree.tree('getParent',
						_curNode.target).target);

				_curTree.tree('select', _curNode.target);

				$('#' + _curNode.domId).trigger('dblclick');
			}
		}

	});
</script>

</html>